<template>
  <a-config-provider :locale="locale">
    <div id="app">
      <router-view/>
    </div>
  </a-config-provider>
</template>
<script>
import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
import enquireScreen from '@/utils/device'
import store from '@/store/'
import { mapState, mapActions } from 'vuex'
import { getAction } from '@/api/manage'
export default {
  data() {
    return {
      locale: zhCN
    }
  },
  watch: {
    $route: {
      handler: function(val, oldVal) {
        const code = this.$route.query.code
        // 监听路由 获取路由权限code
        if (code) {
          this.$store.dispatch('saveWeiXinCode', code)
        }
      },
      // 深度观察监听
      deep: true
    },
    'seting.imgUrl'(val) {
      this.reloadFavicon()
    }
  },
  computed: {
    ...mapState({
      seting: state => state.seting
    })
  },
  created() {
    const that = this
    enquireScreen(deviceType => {
      // tablet
      if (deviceType === 0) {
        that.$store.commit('TOGGLE_DEVICE', 'mobile')
        that.$store.dispatch('setSidebar', false)
      }
      // mobile
      else if (deviceType === 1) {
        that.$store.commit('TOGGLE_DEVICE', 'mobile')
        that.$store.dispatch('setSidebar', false)
      } else {
        that.$store.commit('TOGGLE_DEVICE', 'desktop')
        that.$store.dispatch('setSidebar', true)
      }
    })
    store.dispatch('getSeting')
  },
  methods: {
    reloadFavicon() { // 动态设置浏览器favicon图标
      var link = document.querySelector("link[rel*='icon']") || document.createElement('link')
      link.type = 'image/x-icon'
      link.rel = 'shortcut icon'
      link.href = this.seting.imgUrl
      document.getElementsByTagName('head')[0].appendChild(link)
    }
  }
}
</script>
<style>
  #app {
    height: 100%;
  }
  /* 解决图表第一次渲染完tooltip占位置问题*/
  .g2-tooltip{
    display: none;
  }
  /*解决online在线表单主附表结构，弹窗超宽问题  */
  .jeecg-online-modal:not(.fullscreen) .ant-modal{
    width:80% !important;
  }
  .ant-modal-body .ant-form .ant-form-item{
    margin-bottom: 5px;
  }
  .ant-modal-body .ant-form .ant-form-explain{
    position: absolute;
    z-index: 10;
  }
  input[disabled],.ant-select-disabled{
    color:rgba(0, 0, 0, 0.65) !important;
  }
  .ant-input[disabled],.ant-select-disabled .ant-select-selection{
    background-color: #e8e6e6 !important;
  }
</style>
